import { FC, memo } from 'react'
import { LtSwitchWrapper } from './style'

interface IState {
  children?: React.ReactNode
  checked: boolean
  ltChange?: (flag: boolean) => void
}

const LtSwitch: FC<IState> = memo((props) => {
  const { ltChange, checked } = props
  // 当按钮发送改变
  const changeSwitch = (e: React.ChangeEvent<HTMLInputElement>) => {
    ltChange && ltChange(e.target.checked)
  }
  return (
    <LtSwitchWrapper>
      <label className="switch">
        <input type="checkbox" onChange={changeSwitch} checked={checked} />
        <span className="slider"></span>
        <div className="show_bgc"></div>
      </label>
    </LtSwitchWrapper>
  )
})

export default LtSwitch
